<template>
        <template v-for="(item,index) in data">
        <el-sub-menu
        :key="index"
        :index="item.path"
        :route=true
        v-if="item.children.length > 0"
        >
        <template #title>
            <el-icon>
            <component :is="item.icon"/>
            </el-icon>
            <span>{{item.name}}</span>
   
        </template>
        <menuexpend :menulist="item.children"></menuexpend>
        </el-sub-menu>
        <el-menu-item 
        v-else :index="item.path"
        >
        <el-icon>
            <component :is="item.icon"/>
        </el-icon>
        <span>{{item.name}}</span>
        </el-menu-item>
        </template>

</template>

<script setup name="menuexpend">
import{defineProps,toRefs,ref} from 'vue'
let list = defineProps(["menulist"])
let {menulist} = toRefs(list)
let data = ref(menulist.value)
function Show(){
    console.log(data);
}
</script>
<style>
.el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 200px;
    min-height: 400px;
  }
</style>